import type { TextThemeVarConfig } from '../../types'
import type { LinkThemeVarBaseConfig, LinkThemeVarConfig } from './types'
import {
  ThemeElement,
  ThemeProperty,
  ThemeState,
} from '../../types'
import { BaseThemeVarService } from '../base'

export class LinkThemeVarService extends BaseThemeVarService {
  private static instance: LinkThemeVarService

  static getInstance(): LinkThemeVarService {
    if (!LinkThemeVarService.instance) {
      LinkThemeVarService.instance = new LinkThemeVarService()
    }
    return LinkThemeVarService.instance
  }

  get default(): LinkThemeVarConfig {
    return {
      default: this.base,
      card: this.card,
    }
  }

  get base(): Partial<TextThemeVarConfig> {
    return {
      text: this.varMapper.getVarName(
        { element: ThemeElement.Link, property: ThemeProperty.Text },
      ),
      textHover: this.varMapper.getVarName(
        { element: ThemeElement.Link, property: ThemeProperty.Text, state: ThemeState.Hover },
      ),
      textVisited: this.varMapper.getVarName(
        { element: ThemeElement.Link, property: ThemeProperty.Text, state: ThemeState.Visited },
      ),
    }
  }

  get card(): LinkThemeVarBaseConfig {
    return {
      text: this.varMapper.getVarName(
        { element: ThemeElement.Link, subElement: 'card', property: ThemeProperty.Text },
      ),
      background: this.varMapper.getVarName(
        { element: ThemeElement.Link, subElement: 'card', property: ThemeProperty.Bg },
      ),
      shadow: this.varMapper.getVarName(
        { element: ThemeElement.Link, subElement: 'card', property: ThemeProperty.Shadow },
      ),
    }
  }
}
